@font-face {
  font-family: 'Calistoga-Regular';
  src: url(../Assets/Calistoga-Regular.ttf) format(truetype);
} 

html, body {
  background-repeat: repeat;
  background-size: cover;
  background-image: url(../Assets/BG.png);
  height: 100%;
}

.layout {
  width: 100%;

  display: grid;
  place-content: center;
  width: 100%;
  grid:
    "leftSide body ." 
    "leftSide footer ." 
    / 10% 50% 10%;
  gap: 1%;
}

.leftSide { 
  grid-area: leftSide; 
  font-family: 'Calistoga-Regular';
  background-color: rgb(228, 224, 188);
  background-repeat: repeat;
  background-size: cover;
  background-image: url(../Assets/background.png);
  border:rgb(0, 0, 0) solid 10px;
  font-size: 25px;
}

.body { 
  grid-area: body;
  font-family: 'Calistoga-Regular';
  background-color: rgb(228, 224, 188);
  background-repeat: repeat;
  background-size: cover;
  background-image: url(../Assets/background.png);
  border:rgb(0, 0, 0) solid 10px;
  font-size: 30px;
}

.footer { 
  grid-area: footer; 
  font-family: 'Calistoga-Regular';
  background-color: rgb(228, 224, 188);
  background-repeat: repeat;
  background-size: cover;
  background-image: url(../Assets/background.png);
  display: flex;
  justify-content: space-between;
  justify-content: flex-end;
  align-items: center;
  height: 120%;
    border:rgb(0, 0, 0) solid 10px;
}


.wilkommen {
    color:rgb(0, 0, 0);
    margin: 5%;
}

h1{
    font-weight: bold;
    font-size:70px;
    margin-top: -5%;
    margin-bottom: -2%;
}


h2{
    font-weight: bold;
    font-size:25px;
}

.MiewiNav{
    margin-bottom: -1.5%;
    margin-left: 10%;
  }
  
.link{
    color:rgb(0, 16, 197)
}

.hoverSocials {
  fill: red;
}
.hoverSocials2 {
  fill: #6441A4  ;
}
.hoverSocials3 {
  fill: #ffffff  ;
}
.hoverSocials:hover {
  fill:rgb(89, 0, 0);
}
.hoverSocials2:hover {
  fill: #342256 ;
}
.hoverSocials3:hover {
  fill: #818181 ;
}
.sozialsContent {
    display: flex;
    align-items: flex-start;
    margin: 1%;
  }